<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>失去焦点事件</title>
    <script type="text/javascript">
        //onblur:当鼠标光标失去焦点即鼠标点击其他地方时，执行
        //所有字母变大写
        //方法一
        function upperCase(){
            var elementById = document.getElementById("fname1");
            elementById.value = elementById.value.toUpperCase();//所有字母变大写
        }

        //方法二 在页面加载完成后，完成动态绑定
        window.onload=function (){
            var elementById = document.getElementById("fname2");
            elementById.onblur=function (){
                elementById.value = elementById.value.toUpperCase();
            }
        }
    </script>
</head>
<body>
请输入英文单词:
<input type="text" id="fname1" onblur="upperCase()"/><br>
请输入英文单词:
<input type="text" id="fname2">
</body>
</html>